.list.detailed {
    list-style: none;
    padding: 0;
    margin: 0;

    > * + * {
        margin-top: 5px;
    }

    .link {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
    }

    .avatar {
        margin-right: 10px;
    }

    .name {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

.list:not(.detailed) {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0 0 -10px;

    > * {
        margin: 0 10px 10px 0;
    }
}

.avatar {
    border-radius: 50%;
    background: white;
    box-shadow: 1px 2px 2px 0 hsla(51, 50%, 44%, .35);
    padding: 1px;

    .team & {
        border-radius: 4px;
    }
}

.hidden-name {
    composes: sr-only from '../styles/shared/a11y.module.css';
}
